<template>
	<view class="assign ff-color-000 ff-padding-bottom-130">
		<view
			class="assignTips animate__animated animate__fadeInDown ff-margin-10 ff-font-13 ff-padding-11 ff-border-radius-10 ff-line-height-1-5">
			<view class="ff-align-items-1 ff-flex">
				<u-icon name="info-circle" color="#F97522" size="31"></u-icon>
				<view class="ff-padding-left-5">
					DB37/T 4328—2021，5.2维护保养准备∶
				</view>
			</view>
			<view class="ff-padding-left-20 ff-color-000 ff-font-weight-400">
				消防技术服务机构对建筑消防设施进行维护保养前应确定由具有注册消防工程师资格证书的人员担任项目负责人，由具有相应职业资格证书的消防设施操作员实施维护保养。
			</view>
		</view>
		<view class="ff-margin-10 ff-padding-10 ff-bg-fff ff-border-radius-10">
			<view class="ff-font-16 ff-font-weight-600 ff-margin-bottom-15 ff-padding-top-5">
				<view v-if="assignType == 1">指派</view>
				<view v-if="assignType == 2 || paramsInfo.status == 3">重新指派</view>
			</view>
			<view v-if="status != 3">
				<!-- 维护保养周期 -->
				<view>
					<view class="ff-flex-between ff-padding-top-5 ff-padding-bottom-15 ff-solid-bottom">
						<view>维护保养周期</view>
						<view class="ff-text-right">
							<view @click="maintenancePeriodClick">
								<view v-if="!maintenanceName" class="ff-align-items-one">
									<view class="ff-color-BCBFCC">请选择</view>
									<u-icon name="arrow-right" color="#BCBFCC" size="28"></u-icon>
								</view>
								<view v-else class="ff-align-items-one">
									<view>{{ maintenanceName }}</view>
									<u-icon name="arrow-right" color="#000" size="28"></u-icon>
								</view>
							</view>
						</view>
					</view>
					<u-select v-model="maintenancePeriodState" title="请选择维护保养周期" value-name="id" label-name="macroName"
						mode="single-column" :list="maintenancePeriodList"
						@confirm="maintenancePeriodConfirm"></u-select>
				</view>
				<!-- 项目负责人 -->
				<view class="drawerBox">
					<view class="ff-flex-between ff-padding-top-15 ff-padding-bottom-15 ff-solid-bottom">
						<view>项目负责人</view>
						<view @click="leaderClick">
							<view v-if="!leaderName" class="ff-align-items-one">
								<view class="ff-color-BCBFCC">请选择</view>
								<u-icon name="arrow-right" color="#BCBFCC" size="28"></u-icon>
							</view>
							<view v-else class="ff-align-items-one">
								<view>{{ leaderName }}</view>
								<u-icon name="arrow-right" color="#000" size="28"></u-icon>
							</view>
						</view>
					</view>
					<!-- 选择项目负责人 -->
					<u-popup v-model="leaderState" mode="bottom" :safe-area-inset-bottom="true" :mask-close-able="false"
						height="70%">
						<view class="addDeviceBox">
							<view class="addDeviceBox-title">
								<view class="ff-font-15 ff-text-center ff-margin-bottom-15 ff-flex-between">
									<view class="ff-color-cancel" @click.stop="cancelLeaderClick">取消</view>
									<view>请选择项目负责人</view>
									<view class="ff-color-confirm" @click.stop="confirmLeaderClick">确定</view>
								</view>
								<view class="ff-font-12 ff-color-9A9A9A ff-line-height-1-3">
									指派人员时，请尽量避免指派岗位为“技术负责人的”的员工，否则会影响报告书的签发，请谨慎选择！
								</view>
								<view class="ff-margin-top-15">
									<u-search placeholder="请输入姓名进行搜索" shape="square" bg-color="#fff"
										:show-action="false" :height="80" @change="searchLeaderChange"
										v-model="searchLeaderName"></u-search>
								</view>
							</view>
							<view class="addDeviceBox-content ff-padding-top-135 ff-font-14 ff-color-333">
								<view class="leader" v-if="leaderList.length > 0">
									<view
										class="ff-flex-between leader-content ff-padding-15 ff-margin-15 ff-align-items-one ff-bg-fff ff-border-radius-8"
										v-for="(item, index) of leaderList" :key="index">
										<view class="ff-align-items-one" @click.stop="leaderSelectClick(item)">
											<image
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/reg-3.png"
												mode=""></image>
											<view class="leader-content-info">
												<view class="ff-font-15 ff-margin-bottom-8 ff-line-height-1-3">
													{{ item.username }}{{ item.staffPhone }}
												</view>
												<view class="ff-font-13 ff-margin-bottom-6 ff-color-9A9A9A">
													{{ item.macroName }}
												</view>
												<view class="ff-font-13 ff-margin-bottom-6 ff-color-9A9A9A"
													v-if="item.position">
													{{ item.position }}
												</view>
												<view class="ff-font-13 ff-color-red" v-if="item.invalid">
													证书已到期
												</view>
											</view>
										</view>
										<view class="leader-content-select" @click.stop="leaderSelectClick(item)">
											<view v-if="item.invalid">
												<image
													src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-select-invalid.png"
													mode="">
												</image>
											</view>
											<view v-else>
												<image v-show="!item.leaderCheck"
													src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-select.png"
													mode=""></image>
												<image v-show="item.leaderCheck"
													src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/select.png"
													mode=""></image>
											</view>
										</view>
									</view>
								</view>
								<f-noData v-if="leaderList.length < 1" :topStyle.sync="topStyleAdmin"></f-noData>
							</view>
						</view>
					</u-popup>
				</view>
				<!-- 执业人员 -->
				<view class="drawerBox">
					<view class="ff-flex-between ff-padding-top-15 ff-padding-bottom-15 ff-solid-bottom">
						<view>执业人员</view>
						<view @click.stop="operatorClick">
							<view v-if="!operatorName" class="ff-align-items-one">
								<view class="ff-color-BCBFCC">请选择</view>
								<u-icon name="arrow-right" color="#BCBFCC" size="28"></u-icon>
							</view>
							<view v-else class="ff-align-items-one">
								<view>{{ operatorName }}</view>
								<u-icon name="arrow-right" color="#000" size="28"></u-icon>
							</view>
						</view>
					</view>
				</view>
				<!-- 选择执业人员 -->
				<u-popup v-model="operatorState" mode="bottom" :safe-area-inset-bottom="true" :mask-close-able="false"
					height="70%">
					<view class="addDeviceBox">
						<view class="addDeviceBox-title">
							<view class="ff-font-15 ff-text-center ff-margin-bottom-15 ff-flex-between">
								<view class="ff-color-cancel" @click.stop="cancelOperatorClick">取消</view>
								<view>请选择执业人员</view>
								<view class="ff-color-confirm" @click.stop="confirmOperatorClick">确定</view>
							</view>
							<view class="ff-font-12 ff-color-9A9A9A ff-line-height-1-3">
								指派人员时，请尽量避免指派岗位为“技术负责人的”的员工，否则会影响报告书的签发，请谨慎选择！</view>
							<view class="ff-margin-top-15">
								<u-search placeholder="请输入姓名进行搜索" shape="square" bg-color="#fff" :show-action="false"
									:height="80" @change="searchOperatorChange" v-model="searchOperatorName"></u-search>
							</view>
						</view>
						<view class="addDeviceBox-content ff-padding-top-135 ff-font-14 ff-color-333">
							<view class="leader" v-if="operatorList.length > 0">
								<view
									class="ff-flex-between leader-content ff-padding-15 ff-margin-15 ff-align-items-one ff-bg-fff ff-border-radius-8"
									v-for="(item, index) of operatorList" :key="index">
									<view class="ff-align-items-one" @click.stop="operatorSelectClick(item, index)">
										<image
											src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/reg-3.png"
											mode=""></image>
										<view class="leader-content-info">
											<view class="ff-font-15 ff-margin-bottom-8 ff-line-height-1-3">
												{{ item.username }}{{ item.staffPhone }}
											</view>
											<view class="ff-font-13 ff-margin-bottom-6 ff-color-9A9A9A">
												{{ item.macroName }}
											</view>
											<view class="ff-font-13 ff-margin-bottom-6 ff-color-9A9A9A"
												v-if="item.position">
												{{ item.position }}
											</view>
											<view class="ff-font-13 ff-color-red" v-if="item.invalid">
												证书已到期
											</view>
										</view>
									</view>
									<view class="leader-content-select" @click.stop="operatorSelectClick(item, index)">
										<view v-if="item.invalid">
											<image
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-select-invalid.png"
												mode="">
											</image>
										</view>
										<view v-else>
											<image v-show="!item.operatorCheck"
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-more-select.png"
												mode=""></image>
											<image v-show="item.operatorCheck"
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/more-select.png"
												mode=""></image>
										</view>

									</view>
								</view>
							</view>
							<f-noData v-if="operatorList.length < 1" :topStyle.sync="topStyleAdmin"></f-noData>
						</view>
					</view>
				</u-popup>
			</view>
			<!-- 技术负责人 -->
			<view class="drawerBox" v-if="status == 3">
				<view class="ff-flex-between ff-padding-top-15 ff-padding-bottom-15 ff-solid-bottom">
					<view>技术负责人</view>
					<view @click="signerClick">
						<view v-if="!signerName" class="ff-align-items-one">
							<view class="ff-color-BCBFCC">请选择</view>
							<u-icon name="arrow-right" color="#BCBFCC" size="28"></u-icon>
						</view>
						<view v-else class="ff-align-items-one">
							<view>{{ signerName }}</view>
							<u-icon name="arrow-right" color="#000" size="28"></u-icon>
						</view>
					</view>
				</view>
				<!-- 选择技术负责人 -->
				<u-popup v-model="signerState" mode="bottom" :safe-area-inset-bottom="true" :mask-close-able="false"
					height="70%">
					<view class="addDeviceBox">
						<view class="addDeviceBox-title">
							<view class="ff-font-15 ff-text-center ff-margin-bottom-15 ff-flex-between">
								<view class="ff-color-cancel" @click.stop="cancelSignerClick">取消</view>
								<view>请选择技术负责人</view>
								<view class="ff-color-confirm" @click.stop="confirmSignerClick">确定</view>
							</view>
							<view class="ff-font-12 ff-color-9A9A9A ff-line-height-1-3">如果通过审核，请指定本次技术负责人进行签发报告。</view>
							<view class="ff-margin-top-15">
								<u-search placeholder="请输入姓名进行搜索" shape="square" bg-color="#fff" :show-action="false"
									:height="80" @change="searchSignerChange" v-model="searchSignerName"></u-search>
							</view>
						</view>
						<view class="addDeviceBox-content ff-padding-top-120 ff-font-14 ff-color-333">
							<view class="leader" v-if="signerList.length > 0">
								<view
									class="ff-flex-between leader-content ff-padding-15 ff-margin-15 ff-align-items-one ff-bg-fff ff-border-radius-8"
									v-for="(item, index) of signerList" :key="index">
									<view class="ff-align-items-one" @click.stop="signerSelectClick(item)">
										<image
											src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/reg-3.png"
											mode=""></image>
										<view class="leader-content-info">
											<view class="ff-font-15 ff-margin-bottom-8 ff-line-height-1-3">
												{{ item.username }}{{ item.staffPhone }}
											</view>
											<view class="ff-font-13 ff-margin-bottom-6 ff-color-9A9A9A">
												{{ item.macroName }}
											</view>
											<view class="ff-font-13 ff-margin-bottom-6 ff-color-9A9A9A"
												v-if="item.position">
												{{ item.position }}
											</view>
											<view class="ff-font-13 ff-color-red" v-if="item.invalid">
												证书已到期
											</view>
										</view>
									</view>
									<view class="leader-content-select" @click.stop="signerSelectClick(item)">
										<view v-if="item.invalid">
											<image
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-select-invalid.png"
												mode="">
											</image>
										</view>
										<view v-else>
											<image v-show="!item.signerCheck"
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-select.png"
												mode=""></image>
											<image v-show="item.signerCheck"
												src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/select.png"
												mode=""></image>
										</view>
									</view>
								</view>
							</view>
							<f-noData v-if="signerList.length < 1" :topStyle.sync="topStyleAdmin"></f-noData>
						</view>
					</view>
				</u-popup>
			</view>
		</view>
		<!-- 推荐设备 -->
		<view v-if="assignType == 1" class="ff-margin-10 ff-padding-10 ff-bg-fff ff-border-radius-10">
			<view class="ff-flex-between ff-align-items-one ff-border-bottom ff-padding-bottom-10 ff-padding-top-5">
				<view class="ff-font-16 ff-font-weight-600">推荐设备</view>
				<view class="ff-align-items-one" @click.stop="addDeviceClick">
					<image class="assign-img"
						src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/assign-add.png"
						mode="">
					</image>
					<view class="ff-color-1181FE ff-margin-left-5">选择更多设备</view>
				</view>
			</view>
			<view class="deviceBox drawerBox">
				<view v-for="(item, index) of alreadyDeviceList" :key="index">
					<view v-if="item.deviceNum < 1"
						class="ff-align-items-one ff-flex-between rescindTips ff-line-height-1-5 ff-border-radius-5 ff-font-12 ff-margin-top-15 ff-margin-bottom-10">
						<view>当前设备数量不足，请完善设备库。</view>
						<view @click.stop="upholdDeviceClick">
							<view class="ff-align-items-one">
								<view>维护设备</view>
								<u-icon name="arrow-right" color="#ff0000" size="28"></u-icon>
							</view>
						</view>
					</view>
					<view class="ff-flex-between ff-padding-bottom-15 ff-solid-bottom ff-align-items-one"
						:class="{ 'ff-padding-top-15': item.deviceNum > 0 }">
						<view>{{ index + 1 }}. {{ item.deviceName }}</view>
						<u-number-box v-model="item.numVal" :index="index" :min="0"
							:max="item.deviceNum == 0 ? 0 : item.deviceNum" :input-width="100"
							:input-height="60"></u-number-box>
					</view>
				</view>
				<!-- 添加更多设备 -->
				<u-popup v-model="deviceState" mode="bottom" :safe-area-inset-bottom="true" :mask-close-able="false"
					height="70%">
					<view class="addDeviceBox">
						<view class="addDeviceBox-title ff-font-15 ff-text-center ff-margin-bottom-30 ff-flex-between">
							<view class="ff-color-cancel" @click.stop="cancelDeviceClick">取消</view>
							<view>请添加设备</view>
							<view class="ff-color-confirm" @click.stop="confirmDeviceClick">确定</view>
						</view>
						<view class="addDeviceBox-content ff-margin-top-60 ff-font-14 ff-color-333">
							<view
								class="ff-flex-between ff-align-items-one ff-bg-fff ff-padding-15 ff-margin-12 ff-border-radius-8"
								@click.stop="addNewDeviceClick(item, index)" v-for="(item, index) of allDeviceList"
								:key="index">
								<view class="">{{ index + 1 }}. {{ item.deviceName }}</view>
								<view class="addDeviceBox-content-img">
									<image v-show="!item.newSelectCheck"
										src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/no-more-select.png"
										mode=""></image>
									<image v-show="item.newSelectCheck"
										src="https://fire-system.oss-cn-beijing.aliyuncs.com/web/fire-technology/more-select.png"
										mode=""></image>
								</view>
							</view>
						</view>
					</view>
				</u-popup>
			</view>
		</view>
		<view class="assign-but ff-bg-fff ff-align-items-1 ff-flex-between">
			<view class="ff-font-15">
				<view v-show="status != 3">
					所需工时：<text class="ff-color-blue">{{ needTimeFmt || '/' }}</text>
				</view>
				<view v-show="status != 3">
					<view v-if="assignType == 2" class="ff-margin-top-10">
						已完成工时：<text class="ff-color-FE9025">{{ passTimeFmt == '/' ? '0分钟' : passTimeFmt }}</text>
					</view>
				</view>
			</view>
			<u-button type="primary" shape="circle" @click="assignClick">确定指派</u-button>
		</view>
		<!-- 弹窗区 -->
		<u-toast ref="uToast" />
		<f-loading ref="loading" />
		<u-back-top :scrollTop="scrollTopList.scrollTop" top="200" mode="circle" :iconStyle="scrollTopList.iconStyle"
			:customStyle="scrollTopList.customstyle"></u-back-top>
		<u-modal v-model="deviceModel" @confirm="deviceConfirm" title="温馨提示" show-cancel-button="true"
			:content-style="{ 'line-height': '1.5' }" content="存在数量为0的指派设备，如果继续指派，则代表该项目不需要携带该设备，请确认是否继续？" />
	</view>
</template>

<script>
	export default {
		name: 'Assign',
		data() {
			return {
				deviceModel: false, // 设备为0时的弹窗
				status: '', // 当前项目的状态
				assignType: '', // 当前是指派还是重新指派
				topStyleAdmin: '26%', // 暂无数据的css top状态(管理员)
				// 返回顶部组件参数
				scrollTopList: {
					scrollTop: 0,
					iconStyle: {
						fontSize: '32rpx',
						color: '#FFFFFF'
					},
					customstyle: {
						background: '#3B83FE'
					}
				},
				// 维保周期系列参数--------
				maintenancePeriodState: false, // 维保周期弹框显/隐
				maintenanceName: '', // 选择的维保周期的名字
				maintenancePeriodList: [
					// 维保周期列表数据
					{
						macroName: '月',
						id: 1
					},
					{
						macroName: '季',
						id: 2
					},
					{
						macroName: '半年',
						id: 3
					},
					{
						macroName: '年度',
						id: 4
					},
					{
						macroName: '特殊',
						id: 5
					}
				],
				// 项目负责人系列参数-------
				searchLeaderName: '', // 项目负责人的搜索框
				leaderSearchList: [], // 搜索时用到的列表
				leaderState: false, // 项目负责人弹框显/隐
				leaderName: '', // 选择的项目负责人的名字
				leaderList: [], // 项目负责人列表数据
				// 执业人员系列参数-------
				searchOperatorName: '', // 执业人员的搜索框
				operatorSearchList: [], // 搜索时用到的列表
				operatorState: false, // 执业人员弹框显/隐
				operatorName: '', // 选择的执业人员的名字
				operatorList: [], // 执业人员列表数据
				// 技术负责人系列参数--------
				searchSignerName: '', // 技术负责人的搜索框
				signerSearchList: [], // 搜索时用到的列表
				signerState: false, // 技术负责人弹框显/隐
				signerName: '', // 选择的技术负责人的名字
				signerList: [], // 技术负责人列表数据
				// 设备系列参数--------
				deviceState: false, // 添加设备弹窗显/隐藏
				devicesList: [], // 已有设备列表，默认的
				alreadyDeviceList: [], // 已有的设备列表
				allDeviceList: [], // 获取所有设备的列表
				deviceIds: [], // 添加的设备id集合
				deviceIdsOther: [], // 用于判断选中的回显
				paramsInfo: {}, // 前台传过来的参数
				// 指派
				assignParams: {
					maintenanceType: '', // 维保周期(1:月 2:季 3:半年 4:年 5:特殊)
					maintenanceId: '', // 维保记录ID
					leaders: [], // 项目负责人用户id
					operators: [], // 执业人员用户id
					devices: [] // 执业所需设备
				},
				// 重新选择签发人
				signerParams: {
					maintenanceId: '',
					maintenanceCode: '',
					signer: ''
				},
				needTimeFmt: '', // 所需总工时
				passTimeFmt: '', // 已完成工时
				// 指派时间的数据
				assginTimes: {
					maintenanceId: '',
					maintenanceType: ''
				}
			};
		},
		onPageScroll(e) {
			this.scrollTopList.scrollTop = e.scrollTop;
		},
		onLoad(e) {
			// console.log('前页面传过来的数据------', JSON.parse(e.params));
			// type 1待指派 2重新指派
			let params = JSON.parse(e.params);
			this.paramsInfo = params;
			this.status = params.status;
			if (this.status == 3) {
				// 给签发赋值
				this.signerParams.maintenanceId = params.maintenanceId;
				this.getSignerList(); // 获取技术负责人列表数据
			} else {
				// 给指派系列赋值
				this.assignType = params.type;
				this.assignParams.maintenanceId = params.maintenanceId;
				this.getLeaderList([]); // 获取项目负责人列表数据
				this.getOperatorList([]); // 获取执业人员的列表数据
				// 指派
				if (this.assignType == 1) {
					this.getAlreadyDeviceList(params.projectId); // 获取已有设备列表
				}
				// 再次指派-----获取维保周期回显
				if (this.paramsInfo.lastMaintenanceType) {
					this.maintenancePeriodList.forEach(res => {
						if (res.id == this.paramsInfo.lastMaintenanceType) {
							// this.maintenanceName = res.macroName;
							// this.assignParams.maintenanceType = res.id;
						}
					});
				}
				// 重新指派-----获取维保周期回显
				if (this.assignType == 2) {
					this.maintenancePeriodList.forEach(res => {
						if (res.id == this.paramsInfo.lastMaintenanceType) {
							this.maintenanceName = res.macroName;
							this.assignParams.maintenanceType = res.id;
						}
					});
				}
				this.getAssignShowTime() // 获取指派工时
			}
		},
		methods: {
			// 获取指派工时
			async getAssignShowTime() {
				const data = await this.$http.post({
					url: '/serviceOrg/assignShowTime',
					data: {
						maintenanceId: this.assignParams.maintenanceId,
						maintenanceType: this.assignParams.maintenanceType
					}
				})
				// console.log('获取指派工时', data)
				if (data.code == 200) {
					this.needTimeFmt = data.data.needTimeFmt
					this.passTimeFmt = data.data.passTimeFmt
				} else {
					this.$refs.uToast.show({
						title: data.msg,
						type: 'error'
					});
				}
			},
			// ----------------------维保周期--------------------------------
			maintenancePeriodClick() {
				this.maintenancePeriodState = true;
			},
			// 点击选择维保周期
			maintenancePeriodConfirm(e) {
				this.maintenanceName = e[0].label;
				this.assignParams.maintenanceType = e[0].value;
				this.getAssignShowTime() // 获取指派工时
			},
			//---------------------选择项目负责人-----------------------------
			// 获取项目负责人
			async getLeaderList(id) {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				let params = {
					userIds: id.join(',') || ''
				};
				const data = await this.$http.post({
					url: '/serviceOrg/staff/queryRegisterFireEngineers',
					data: params
				});
				// console.log('获取项目负责人列表数据-----', data);
				if (data.code == 200) {
					data.data.forEach(res => {
						this.$set(res, 'leaderCheck', false);
					});
					this.leaderList = data.data;
					this.leaderSearchList = data.data; // 搜索时用到
					// 重新指派
					if (this.assignType == 2) {
						this.assignParams.leaders = [];
						this.leaderList.forEach(res => {
							if (res.userId == this.paramsInfo.lastLeaders[0].userId) {
								this.leaderName = res.username;
								this.assignParams.leaders.push(res.userId);
							}
						});
						this.getOperatorListEcho(this.assignParams.leaders); // 重新获取执业人员数据
					}
					// 再次指派-----获取维保周期回显
					if (this.paramsInfo.lastLeaders) {
						if (this.paramsInfo.lastLeaders.length > 0) {
							this.assignParams.leaders = [];
							this.leaderList.forEach(res => {
								if (res.userId == this.paramsInfo.lastLeaders[0].userId) {
									this.leaderName = res.username;
									this.assignParams.leaders.push(res.userId);
								}
							});
							this.getOperatorListEcho(this.assignParams.leaders); // 重新获取执业人员数据
						}
					}

				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 获取项目负责人-------回显用
			async getLeaderListEcho(id) {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				let params = {
					userIds: id.join(',') || ''
				};
				const data = await this.$http.post({
					url: '/serviceOrg/staff/queryRegisterFireEngineers',
					data: params
				});
				// console.log('获取项目负责人列表数据-----', data);
				if (data.code == 200) {
					data.data.forEach(res => {
						this.$set(res, 'leaderCheck', false);
					});
					this.leaderList = data.data;
					this.leaderSearchList = data.data; // 搜索时用到
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 点击打开项目负责人弹框
			leaderClick() {
				// 判断当选中后再次打开，依然回显
				if (this.assignParams.leaders.length > 0) {
					this.leaderList.forEach(res => {
						if (res.userId == this.assignParams.leaders[0]) {
							this.$set(res, 'leaderCheck', true);
						} else {
							this.$set(res, 'leaderCheck', false);
						}
					});
				} else {
					this.leaderList.forEach(item => {
						this.$set(item, 'leaderCheck', false);
					});
				}
				this.leaderState = true;
			},
			// 选择项目负责人
			leaderSelectClick(item) {
				if (item.invalid) {
					return
				}
				this.leaderList.forEach(res => {
					if (res.id == item.id) {
						this.$set(res, 'leaderCheck', true);
					} else {
						this.$set(res, 'leaderCheck', false);
					}
				});
			},
			// 项目负责人--------搜索框搜索名字
			searchLeaderChange() {
				if (this.searchLeaderName) {
					let leadersList = [];
					this.leaderSearchList.map(res => {
						if (res.username.search(this.searchLeaderName) != -1) {
							leadersList.push(res);
						}
					});
					this.leaderList = leadersList;
				} else {
					this.leaderList = this.leaderSearchList;
				}
			},
			// 关闭-----项目负责人弹框
			cancelLeaderClick() {
				this.leaderState = false;
			},
			// 确定----项目负责人弹框
			confirmLeaderClick() {
				this.assignParams.leaders = [];
				this.leaderList.forEach(res => {
					if (res.leaderCheck) {
						this.leaderName = res.username;
						this.assignParams.leaders.push(res.userId);
					}
				});
				// 判断是否选择---- 项目负责人
				if (!this.leaderName) {
					this.$refs.uToast.show({
						title: '请选择项目负责人',
						type: 'error'
					});
					throw 'jumpout'; // 要想跳出整个forEach循环，可以使用抛异常的方式：
				}
				this.getOperatorListEcho(this.assignParams.leaders); // 重新获取执业人员数据
				this.leaderState = false;
			},

			//---------------------选择执业人员-----------------------------
			// 获取执业人员
			async getOperatorList(id) {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				let params = {
					userIds: id.join(',') || ''
				};
				const data = await this.$http.post({
					url: '/serviceOrg/staff/queryOperatorListMaintenance',
					data: params
				});
				// console.log('获取执业人员列表数据-----', data);
				if (data.code == 200) {
					data.data.forEach(res => {
						this.$set(res, 'operatorCheck', false);
					});
					this.operatorList = data.data;
					this.operatorSearchList = data.data; // 搜索时用到
					// 再次指派-----获取维保周期回显
					if (this.paramsInfo.lastOperators) {
						if (this.paramsInfo.lastOperators.length > 0) {
							this.operatorName = [];
							this.assignParams.operators = [];
							this.paramsInfo.lastOperators.forEach(res => {
								this.operatorList.forEach(item => {
									if (item.userId == res.userId) {
										this.operatorName.push(item.username);
										this.assignParams.operators.push(item.userId);
									}
								});
							});
							this.operatorName = this.operatorName.join(','); // 给名字赋值
							this.getLeaderListEcho(this.assignParams.operators); // 重新获取项目负责人数据
						}
					}

					// 重新指派
					if (this.assignType == 2) {
						this.operatorName = [];
						this.assignParams.operators = [];
						this.paramsInfo.lastOperators.forEach(res => {
							this.operatorList.forEach(item => {
								if (item.userId == res.userId) {
									this.operatorName.push(item.username);
									this.assignParams.operators.push(item.userId);
								}
							});
						});
						this.operatorName = this.operatorName.join(','); // 给名字赋值
						this.getLeaderListEcho(this.assignParams.operators); // 重新获取项目负责人数据
					}
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 获取执业人员---回显用
			async getOperatorListEcho(id) {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				let params = {
					userIds: id.join(',') || ''
				};
				const data = await this.$http.post({
					url: '/serviceOrg/staff/queryOperatorListMaintenance',
					data: params
				});
				// console.log('获取执业人员列表数据-----', data);
				if (data.code == 200) {
					data.data.forEach(res => {
						this.$set(res, 'operatorCheck', false);
					});
					this.operatorList = data.data;
					this.operatorSearchList = data.data; // 搜索时用到
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 点击打开执业人员弹框
			operatorClick() {
				// 判断当选中后再次打开，依然回显
				if (this.assignParams.operators.length > 0) {
					this.assignParams.operators.forEach(res => {
						this.operatorList.forEach(item => {
							if (item.userId == res) {
								this.$set(item, 'operatorCheck', true);
							} else {
								// this.$set(item, 'operatorCheck', false);
							}
						});
					});
				} else {
					this.operatorList.forEach(item => {
						this.$set(item, 'operatorCheck', false);
					});
				}
				this.operatorState = true;
			},
			// 选择执业人员
			operatorSelectClick(item, index) {
				if (item.invalid) {
					return
				}
				this.operatorList[index].operatorCheck = !this.operatorList[index].operatorCheck;
			},
			// 执业人员--------搜索框搜索名字
			searchOperatorChange() {
				if (this.searchOperatorName) {
					let operatorsList = [];
					this.operatorSearchList.map(res => {
						if (res.username.search(this.searchOperatorName) != -1) {
							operatorsList.push(res);
						}
					});
					this.operatorList = operatorsList;
				} else {
					this.operatorList = this.operatorSearchList;
				}
			},
			// 关闭-----执业人员弹框
			cancelOperatorClick() {
				this.operatorState = false;
			},
			// 确定----执业人员弹框
			confirmOperatorClick() {
				// console.log(this.operatorList, 'this.operatorList', this.operatorSearchList)
				// return
				this.operatorName = [];
				this.assignParams.operators = [];
				// operatorList
				this.operatorSearchList.forEach(res => {
					if (res.operatorCheck) {
						this.operatorName.push(res.username);
						this.assignParams.operators.push(res.userId);
					}
				});
				this.operatorName = this.operatorName.join(','); // 给名字赋值
				// 判断是否选择---- 执业人员
				if (!this.operatorName) {
					this.$refs.uToast.show({
						title: '请至少选择一名执业人员',
						type: 'error'
					});
					throw 'jumpout'; // 要想跳出整个forEach循环，可以使用抛异常的方式：
				}
				this.getLeaderListEcho(this.assignParams.operators); // 重新获取项目负责人数据
				this.operatorState = false;
			},

			//---------------------选择技术负责人-----------------------------
			// 获取技术负责人
			async getSignerList() {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				let params = {
					maintenanceId: this.signerParams.maintenanceId
				};
				const data = await this.$http.post({
					url: '/serviceOrg/staff/querySigner',
					data: params
				});
				// console.log('获取技术负责人列表数据-----', data);
				if (data.code == 200) {
					data.data.forEach(res => {
						this.$set(res, 'signerCheck', false);
					});
					this.signerList = data.data;
					this.signerSearchList = data.data; // 搜索时用到
					// 给技术负责人=====回显
					if (this.paramsInfo.status == 3) {
						this.signerList.forEach(res => {
							if (res.userId == this.paramsInfo.signers[0].userId) {
								this.signerName = res.username;
								this.signerParams.signer = res.userId;
							}
						});
					}
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 点击打开技术负责人弹框
			signerClick() {
				// 判断当选中后再次打开，依然回显
				if (this.signerParams.signer) {
					this.signerList.forEach(res => {
						if (res.userId == this.signerParams.signer) {
							this.$set(res, 'signerCheck', true);
						} else {
							this.$set(res, 'signerCheck', false);
						}
					});
				} else {
					this.signerList.forEach(item => {
						this.$set(item, 'signerCheck', false);
					});
				}
				this.signerState = true;
			},
			// 选择技术负责人
			signerSelectClick(item) {
				if (item.invalid) {
					return
				}
				this.signerList.forEach(res => {
					if (res.id == item.id) {
						this.$set(res, 'signerCheck', true);
					} else {
						this.$set(res, 'signerCheck', false);
					}
				});
			},
			// 技术负责人--------搜索框搜索名字
			searchSignerChange() {
				if (this.searchSignerName) {
					let signersList = [];
					this.signerSearchList.map(res => {
						if (res.username.search(this.searchSignerName) != -1) {
							signersList.push(res);
						}
					});
					this.signerList = signersList;
				} else {
					this.signerList = this.signerSearchList;
				}
			},
			// 关闭-----技术负责人弹框
			cancelSignerClick() {
				this.signerState = false;
			},
			// 确定----技术负责人弹框
			confirmSignerClick() {
				this.signerList.forEach(res => {
					if (res.signerCheck) {
						this.signerName = res.username;
						this.signerParams.signer = res.userId;
					}
				});
				// 判断是否选择---- 执业人员
				if (!this.signerName) {
					this.$refs.uToast.show({
						title: '请选择技术负责人',
						type: 'error'
					});
					throw 'jumpout'; // 要想跳出整个forEach循环，可以使用抛异常的方式：
				}
				this.signerState = false;
			},

			// ---------------------设备模块---------------------------------
			// 获取已有设备列表
			async getAlreadyDeviceList(id) {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				const data = await this.$http.post({
					url: `/serviceOrg/project/${id}/queryNeedDevice`
				});
				// console.log('获取已有设备列表-----', data);
				if (data.code == 200) {
					let devicesList = [];
					data.data.map(res => {
						if (res.deviceNum > 0) {
							devicesList.push(Object.assign(res, {
								numVal: 1
							}));
						} else {
							devicesList.push(Object.assign(res, {
								numVal: 0
							}));
						}
					});
					this.devicesList = devicesList; // 默认的设备列表
					this.alreadyDeviceList = devicesList;
					this.getAllDeviceList(); // 获取所有的设备列表
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 获取所有设备的列表数据
			async getAllDeviceList() {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				const data = await this.$http.get({
					url: `/serviceOrg/allDeviceV3`
				});
				// console.log('获取所有设备的列表数据-----', data);
				if (data.code == 200) {
					this.alreadyDeviceList.forEach(res => {
						data.data.filter(item => {
							this.$set(item, 'newSelectCheck', false);
							if (item.orgDeviceId == res.orgDeviceId) {
								data.data.splice(data.data.indexOf(item), 1);
							}
						});
					});
					this.allDeviceList = data.data;
				}
				this.$refs.loading.closeLoading(); // 关闭loading动画
			},
			// 添加设备----打开弹窗
			addDeviceClick() {
				if (this.deviceIdsOther.length > 0) {
					this.deviceIdsOther.forEach(res => {
						this.allDeviceList.forEach(item => {
							if (item.orgDeviceId == res) {
								this.$set(item, 'newSelectCheck', true);
							}
						});
					});
				}
				this.deviceState = true;
			},
			// 添加设备-----选择
			addNewDeviceClick(item, index) {
				this.allDeviceList[index].newSelectCheck = !this.allDeviceList[index].newSelectCheck;
			},
			// 添加设备-----取消
			cancelDeviceClick() {
				this.deviceState = false;
			},
			// 添加设备-----确定
			confirmDeviceClick() {
				let newDevice = []; // 选中的设备
				this.deviceIds = []; // 添加的设备id
				this.deviceIdsOther = [] // 选中的id
				this.allDeviceList.forEach(item => {
					if (item.newSelectCheck) {
						newDevice.push(item);
						this.deviceIds.push(item.facilitiesDeviceId);
						this.deviceIdsOther.push(item.orgDeviceId);
					}
				});
				// 判断是否添加---- 设备
				// if (newDevice.length < 1) {
				// 	this.$refs.uToast.show({
				// 		title: '请至少选择一项设备',
				// 		type: 'error'
				// 	});
				// 	throw 'jumpout'; // 要想跳出整个forEach循环，可以使用抛异常的方式：
				// }
				let devicesConcat = this.devicesList.concat(newDevice);
				let devicesList = [];
				devicesConcat.forEach(res => {
					if (res.deviceNum > 0) {
						// devicesList.push(Object.assign(res, {
						// 	numVal: 1
						// }));
						devicesList.push(res)
					} else {
						devicesList.push(Object.assign(res, {
							numVal: 0
						}));
					}
				});
				this.alreadyDeviceList = devicesList; // 给已有的设备赋值
				this.deviceState = false;
			},
			// 当前设备不足，跳转到设备列表页面维护设备
			upholdDeviceClick() {
				this.$pageJump.navigateTo(
					'/pages/maintenance/mechanism/home/components/deviceManagement/deviceManagement');
			},
			// 提交-----------------确定指派
			assignClick() {
				let that = this;
				// 选择技术负责人
				if (that.status == 3) {
					if (!that.signerParams.signer) {
						that.$refs.uToast.show({
							title: '请选择技术负责人',
							type: 'error'
						});
						return;
					}
					that.$refs.loading.openLoading('提交中···'); // 打开loading动画
					that.$http.post({
						url: `/serviceOrg/staff/anewConfirmSigner`,
						data: that.signerParams
					}).then(res => {
						// console.log('获取重新指派技术负责人返回的结果-----', res);
						that.$refs.loading.closeLoading(); // 关闭loading动画
						if (res.code == 200) {
							that.$refs.uToast.show({
								title: '指派成功',
								type: 'success'
							});
							setTimeout(() => {
								that.$pageJump.reLaunch('/pages/maintenance/mechanism/Maintenance');
							}, 500);
						} else {
							that.$refs.uToast.show({
								title: res.msg,
								type: 'error'
							});
						}
					});
					return;
				}
				// 指派or重新指派
				// 给提交的设备赋值
				this.assignParams.devices = [];
				this.alreadyDeviceList.forEach(res => {
					this.assignParams.devices.push({
						deviceName: res.deviceName,
						deviceNum: res.numVal,
						facilitiesDeviceId: res.facilitiesDeviceId,
						orgDeviceId: res.orgDeviceId
					});
				});
				if (!that.assignParams.maintenanceType) {
					that.$refs.uToast.show({
						title: '请选择维保周期',
						type: 'error'
					});
					return;
				}
				if (that.assignParams.leaders.length < 1) {
					that.$refs.uToast.show({
						title: '请选择项目负责人',
						type: 'error'
					});
					return;
				}
				if (that.assignParams.operators.length < 1) {
					that.$refs.uToast.show({
						title: '请选择执业人员',
						type: 'error'
					});
					return;
				}
				if (that.assignParams.devices.length < 1 && this.assignType == 1) {
					that.$refs.uToast.show({
						title: '请至少选择一种设备',
						type: 'error'
					});
					return;
				}
				// 判断是否有数量为0的指派设备
				let noDevices = [];
				this.assignParams.devices.forEach(res => {
					if (res.deviceNum == 0 || res.deviceNum == null) {
						noDevices.push(res.deviceName);
					}
				});
				if (noDevices.length > 0) {
					this.deviceModel = true;
					return;
				}
				// 当设备数量没有为0的时候---------
				this.$refs.loading.openLoading('提交中···'); // 打开loading动画
				this.$http.post({
					url: '/serviceOrg/project/assignV5',
					data: this.assignParams
				}).then(res => {
					// console.log('获取指派返回的结果-----', res);
					this.$refs.loading.closeLoading(); // 关闭loading动画
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '指派成功',
							type: 'success'
						});
						setTimeout(() => {
							this.$pageJump.reLaunch('/pages/maintenance/mechanism/Maintenance');
						}, 500);
					} else {
						uni.showModal({
							title: '无法指派',
							content: res.msg,
							confirmColor: '#3178FF',
							showCancel: false,
							success: function(res) {
								if (res.confirm) {
									// console.log('用户点击确定')
								}
							}
						})
					}
				});
			},
			// 数量为0的指派设备-----确定
			deviceConfirm() {
				this.$refs.loading.openLoading('提交中···'); // 打开loading动画
				this.$http.post({
					url: '/serviceOrg/project/assignV5',
					data: this.assignParams
				}).then(res => {
					// console.log('获取指派返回的结果-----', res);
					this.$refs.loading.closeLoading(); // 关闭loading动画
					if (res.code == 200) {
						this.$refs.uToast.show({
							title: '指派成功',
							type: 'success'
						});
						setTimeout(() => {
							this.$pageJump.reLaunch('/pages/maintenance/mechanism/Maintenance');
						}, 500);
					} else {
						this.$refs.uToast.show({
							title: res.msg,
							type: 'error'
						});
					}
				});
			}
		},
		onShareAppMessage() {
			return {
				title: '分享小程序给朋友',
				path: '/pages/homePage/Home'
			};
		}
	};
</script>

<style lang="scss" scoped>
	.assign {
		.assignTips {
			color: #F97522;
			background-color: #FDEFE3;
		}

		&-img {
			width: 28rpx;
			height: 28rpx;
		}

		.ff-color-1181FE {
			color: #499fff;
		}

		.deviceBox {
			// max-height: 600rpx;
			overflow-y: auto;
		}

		.drawerBox {
			/deep/.u-drawer-content-visible {
				background-color: #f8f8f8 !important;
			}
		}

		.rescindTips {
			background-color: #ffebeb;
			color: #ff0000;
			padding: 25rpx 18rpx;
		}

		&-but {
			box-shadow: 2rpx 0 2rpx #f5f5f5;
			position: fixed;
			bottom: 0;
			z-index: 9;
			width: 100%;
			padding: 42rpx 30rpx;
		}

		.ff-padding-top-135 {
			padding-top: 270rpx;
		}

		.ff-padding-top-120 {
			padding-top: 240rpx;
		}

		.leader {
			&-content {
				padding: 24rpx 30rpx;
				align-items: center;

				.ff-align-items-one {
					image {
						width: 100rpx;
						height: 100rpx;
						margin-right: 32rpx;
					}
				}

				&-info {
					width: 430rpx;
				}

				&-select {
					image {
						width: 42rpx;
						height: 42rpx;
					}
				}
			}
		}

		.addDeviceBox {
			&-title {
				position: fixed;
				top: 0;
				left: 0;
				width: 100%;
				padding: 30rpx;
				z-index: 99;
				background-color: #f8f8f8;
			}

			&-content {
				&-img {
					image {
						width: 45rpx;
						height: 45rpx;
					}
				}
			}
		}
	}

	.ff-color-FE9025 {
		color: #FE9025;
	}

	/deep/.u-size-default {
		height: 80rpx !important;
		line-height: 80rpx !important;
	}
</style>